<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html >
<html lang="en">
<head>
<%@include file="../common/includeBaseSet.jsp" %>
<%@include file="../common/includeSystemSet.jsp" %>
<%@include file="../common/operation_forbid.jsp" %>
<%@include file="../common/jsVersion.jsp" %>
<link rel="stylesheet" href="${jypath}/static/css/css.css" />
<link rel="stylesheet" type="text/css"  href="${jypath}/static/ext/resources/ext-theme-gray/ext-theme-gray-all.css" />
<script type="text/javascript" src="${jypath}/static/ext/ext-all.js"></script>
<script type="text/javascript" src="${jypath}/static/ext/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="${jypath}/static/js/components/callComponent.js?v=${jsVersion}"></script>
<style type="text/css">
	ul { list-style-type: none;}
	a {cursor:pointer;}
</style>
</head>
<body>
	<div class="record_box" style="height:400px">
		<form id="baseForm" class="form-horizontal">
			<input type="hidden" name="status" id="status">
			<input type="hidden" name="id" id="id">
			<input type="hidden" name="callNum" id="callNum" value="0">
			<input type="hidden" name="phone" id="phone">
		<div class="rec_lef">
        	<p class="rec_title"><b></b>快捷记录</p>
        	<ul class="rec_list">
            	<li>
                	<p>客户姓名：</p>
                    <input type="text" name="userName" id="userName" class="ipt_rec" style="width:30%; margin-right:20px;">
                    <font id="phoneText"></font>
                </li>
            	<li>
                	<p>说明：</p>
                	<span id="caption"></span>
                </li>
                <li>
                	<p>关注问题：</p>
                    <input type="text" class="ipt_rec" name="concern" id="concern">
                </li>
                <li>
                	<p>失败原因：</p>
                    <input type="text" class="ipt_rec" name="failure" id="failure">
                </li>
                <li>
                	<p>备注：</p>
                    <input type="text" class="ipt_rec" name="remark" id="remark">
                </li>
                <li>
                	<p>到访时间：</p>
                    <input name="visitDate" id="visitDate" type="text" class="ipt_rec" readonly="readonly" onClick="WdatePicker()">
                </li>
                <li>
                	<p>转到项目：</p>
                    <select class=" input_txt" id="projectId" name="projectId" style="width:252px;">
                        <option>请选择</option>
                    </select>
                </li>
            </ul>
        </div>
        </form>
        <div class="rec_rig" style="width:54%;height:100%">
        	<p class="rec_title"><b></b>历史通话记录</p>
        	<ul class="rec_list2">	
            	<!-- 通话记录 -->
            </ul>
        </div>
    </div>
   	<div class="clear"></div>
    <div class="rec_btnbox">
    	<a class="bg_borgray" onclick="save(1)">保存(并转待跟进)</a>
    	<a class="bg_borgray" onclick="save(2)">保存(并转无效)</a>
        <a class="bg_borgray" onclick="zhuanke()">保存(并转客)</a>
    </div>
</body>
<script type="text/javascript">
	var layerIndex = parent.layer.getFrameIndex(window.name); //获取窗口索引
	
	$(function(){
		getProjects();
		callCustomer();
		telRecordList();
		$(".rec_btnbox a").hover(function(){  
            $(this).attr("class", "bg_blue");  
        },function(){  
        	$(this).attr("class", "bg_borgray");  
        })  
	});
	
	//查询客户信息
	function callCustomer(){
		$.ajax({
			 url: "${jypath}/call/callCustomer/view",
		     type: "post",
		     dataType:'json', 
		     async:false,
		     data:{
		    	 "id":"${id}"
		     },
		     success:function(data){
		   		if(data.res == "1"){
		   			var obj = data.obj;
		   			$("#userName").val(obj.userName);
		   			$("#phoneText").text("电话："+obj.yhPhone);
		   			if(obj.caption != null){
		   				$("#caption").text(obj.caption);
		   			}
		   			$("#concern").val(JY.Object.notEmpty(obj.concern));
		   			$("#failure").val(JY.Object.notEmpty(obj.failure));
		   			$("#remark").val(JY.Object.notEmpty(obj.remark));
		   			$("#visitDate").val(JY.Date.Format(obj.visitTime, "yyyy-MM-dd"));
		   			$("#projectId").val(obj.projectId);
		   		}
		     }
		});
	}
	
	//历史通话记录
	function telRecordList(){
		$.ajax({
			 url: "${jypath}/call/callCustomer/telRecordList",
		     type: "post",
		     dataType:'json', 
		     async:false,
		     data:{
		    	 "relationId":"${id}"
		     },
		     success:function(data){
		    	$(".rec_list2").empty();
		   		if(data.res == "1"){
		   			var obj = data.obj.entity;
		   			if(obj == null){
		   				return false;
		   			}
		   			var html = "";
		   			for(var i = 0; i < obj.length; i++){
		   				html+= '<li>';
	   					html+= '<p>'+JY.Date.Format(obj[i].createTime, "yyyy-MM-dd")+'</p>';
	   					html+= '<audio style="width:280px" src="'+obj[i].recordUrl+'" controls="controls">';
	   					html+= '您的浏览器不支持录音播放';
	   					html+= '</audio>';
	   					html+= '<font>'+obj[i].userName+'</font>';
	   					html+= '</li>';
		   			}
		   			$(".rec_list2").html(html);
		   		}
		     }
		});
	}
	
	//查询项目列表
	function getProjects(){
		$.ajax({
			type: 'post',
	        url: "${jypath}/call/callCustomer/projects",
		    data: {},
		    dataType:'json',
		    async:false,
		    success: function(res){
		    	$("#projectId").empty();
		    	var list=res.obj;
		    	var option='<option value="" >请选择</option>';
	    		$.each(list, function(index, row) {
	    			option=option+'<option value="'+row.id+'">'+row.projectName+'</option>';
	    		});
	    		$("#projectId").html(option);
		    }
		});
	}
	
	function zhuanke(){
		if($("#maintainUser").val() == ""){
			layer.alert("当前客户未分配维护人，不能进行转客操作");
			return false;
		}
		//当选择转客时，校验是否已选项目
		if($("#projectId").val() == ""){
			layer.tips("请选择项目", "#projectId");
			return false;
		}
		layer.confirm('将客户转到'+$("#projectId").find("option:selected").text()+'项目',  {
			 btn: ['确定','取消'] //按钮
		}, function(){
			layer.closeAll('dialog'); //关闭询问框
			save("3");
	    });
	}
	
	function save(status){
		if($("#userName").val() == ""){
			layer.tips("请填写客户姓名", "#userName");
			return false;
		}
		$("#status").val(status);
		
		layer.load(0, {shade: false}); //弹出加载层
		$.ajax({
			 url: "${jypath}/call/callCustomer/edit",
		     type: "post",
		     dataType:'json', 
		     async:false,
		     data:{
		    	"concern":$("#concern").val(),
		    	"failure":$("#failure").val(),
		    	"remark":$("#remark").val(),
		    	"visitDate":$("#visitDate").val(),
		    	"projectId":$("#projectId").val(),
		    	"userName":$("#userName").val(),
		    	"status":$("#status").val(),
		    	"id":"${id}",
		    	"callNum":$("#callNum").val(),
		    	"phone":$("#phone").val()
		     },
		     success:function(data){
		    	layer.closeAll('loading'); //关闭加载层
				if(data.res == "1"){
					//刷新父窗口列表
					parent.getCount();
					parent.getbaseList(1); 
					layer.alert("操作成功");
				}else{
					layer.alert(data.resMsg);
				}
		     }
		});
	}

</script>
</html>